.p-f {
  width: 100%;
  top: 0;
  left: 0;
  z-index: 99;
}

.topp {
  position: relative;
  height: 360rpx;
  background-image: url("https://m.bjclb.cn/assets/classroom/shuju.png");
  background-size: 100% 100%;
  z-index: 0;
}

.riqi {
  width: 28rpx;
  height: 28rpx;
}

.content {
  position: relative;
  top: -144rpx;
}

.content .j-b {
  margin: 0 29rpx 47rpx 29rpx;
}

.content .select {
  font-weight: bold;
  font-size: 30rpx;
  color: #ffffff;
  text-align: left;
}

.content .select > image {
  width: 22rpx;
  height: 20rpx;
}

.content .time {
  width: 205rpx;
  padding: 10rpx 0;
  background: rgba(249, 250, 253, 0.1);
  border-radius: 50rpx;
  border: 1rpx solid #ebebeb;
}

.content .time image {
  width: 24rpx;
  height: 24rpx;
  margin-right: 13rpx;
}

.contentdata {
  background-color: #ffffff;
  border-radius: 24rpx 24rpx 0rpx 0rpx;
  display: flex;
  flex-wrap: wrap;
  padding: 40rpx 30rpx;
  z-index: 99;
}

.contentdata > .border {
  z-index: 99;
  width: 33%;
  padding: 27rpx 0rpx;
}

.contentdata > .border view > image {
  width: 24rpx;
  height: 24rpx;
  margin-right: 8rpx;
}

.contentdata > .border .p1 {
  font-weight: bold;
  font-size: 32rpx;
  color: #333333;
  text-align: center;
  margin-bottom: 10rpx;
}

.contentdata > .border > view:nth-child(2) {
  font-weight: 500;
  font-size: 24rpx;
  color: #b3b7c2;
  margin-top: 13rpx;
  width: 90%;
  margin: auto;
}

.contentdata .border {
  z-index: 999;
  border-bottom: 3rpx dashed #ccc;
  border-right: 3rpx dashed #ccc;
}

.contentdata .border .ov {
  text-align: left;
}

.contentdata .border:nth-child(3n) {
  border-right: 0;
}

.contentdata .border:nth-child(1) {
  border-top: 0;
}

.contentdata .border:nth-child(2) {
  border-top: 0;
}

.contentdata .border:nth-child(3) {
  border-top: 0;
}

.xian {
  background-color: #fff;
  bottom: 39rpx;
  left: 0;
  width: 750rpx;
  height: 5rpx;
  z-index: 999;
}

.bedtime_title {
  margin-left: 22rpx;
  text-align: left;
  position: relative;
}

.statistical {
  margin-top: 20rpx;
  background-color: #fff;
  padding: 39rpx 29rpx;
}

.csk {
  top: 85rpx;
  position: absolute;
  text-align: left;
  color: #333333;
}

.bedtime_title::after {
  content: "";
  position: absolute;
  width: 8rpx;
  height: 28rpx;
  left: -20rpx;
  background: linear-gradient(0deg, #3171ff 0%, #85aafd 100%);
  top: 50%;
  margin-top: -14rpx;
}

.foot {
  margin-top: 40rpx;
  position: relative;
}

.foot > view:nth-child(1) {
  text-align: left;
  margin-left: 50rpx;
}

.listse {
  display: flex;
  flex-wrap: wrap;
}

.lists {
  margin-left: 25rpx;
  margin-top: 20rpx;
  width: 297rpx;
  background-color: #ffffff;
  padding: 20rpx;
  border-radius: 6rpx;
}

.lists image {
  margin-right: 15rpx;
  width: 60rpx;
  height: 60rpx;
}

.lists .ov {
  width: 210rpx;
}

.cont {
  background-color: #f5f7fa;
  display: flex;
  border-radius: 6rpx;
  margin-top: 21rpx;
  padding: 21rpx 0;
}

.cont > view:nth-child(1) {
  width: 50%;
  text-align: center;
  border-right: 1rpx dotted #e0e0e0;
}

.cont > view:nth-child(1) > view {
  font-size: 22rpx;
  color: #999999;
}

.cont > view:nth-child(1) > view:nth-child(2) {
  font-size: 30rpx;
  color: #247af1;
  margin-top: 20rpx;
}

.cont > view:nth-child(1) > view:nth-child(2) > span {
  font-size: 22rpx;
}

.cont > view:nth-child(2) {
  width: 50%;
  text-align: center;
}

.cont > view:nth-child(2) > view {
  font-size: 22rpx;
  color: #999999;
}

.cont > view:nth-child(2) > view:nth-child(2) {
  margin-top: 20rpx;
  font-size: 32rpx;
  color: #333333;
}

.cont > view:nth-child(2) > view:nth-child(2) > span {
  font-size: 14rpx;
}

.wid {
  width: 175rpx;
  height: 52rpx;
}
